/**
 * Created by wzl on 2017/4/23.
 */
import {Component} from 'react';
import {geom2VecArr} from '../util/util';
import * as THREE from 'three';
import {MeshLine,MeshLineMaterial} from 'three.meshline';

class Road extends Component {
    constructor(props){
        super(props);
        this.state={
            object:new THREE.Object3D()
        }
    }
    componentDidMount(){
        const {layer, tileObject, tileSize} = this.props;
        // console.log('Road ',layer);
        if(layer){
            let extent = layer.extent;
            let len = layer.length;
            // let object = new THREE.Object3D();
            for (let i = 0; i < len; i++) {
                let feature = layer.feature(i);
                let geom = feature.loadGeometry();//直接用GeoJSON

                geom.forEach((item)=>{
                    let vecArr = geom2VecArr(item,extent,tileSize);
                    let geometry = new THREE.Geometry();
                    geometry.vertices = vecArr;
                    let line = new MeshLine();
                    line.setGeometry( geometry ,function( p ) { return 5; });
                    let material = new MeshLineMaterial({
                        color:new THREE.Color('hsl(0, 0%, 100%)'),
                        polygonOffset:true,
                        polygonOffsetFactor:0.5,
                        depthTest: false
                    });

                    let mesh = new THREE.Mesh( line.geometry, material ) ;

                    this.state.object.add(mesh);
                })
            }
            tileObject.add(this.state.object);
        }
    }
    componentWillUnmount(){
        const {tileObject} = this.props;
        if(tileObject && this.state.object){
            tileObject.remove(this.state.object);
        }
    }
    render(){
        return null;
    }
}

export default Road;